<template>

  <div>
    <div style="height: 150px"></div>
    <div class="avatar_box" align="center">
      <img src="../assets/logo.webp" alt="avatar" />
    </div>
    <van-form @submit="login">
      <van-field
          v-model="username"
          name="用户名"
          label="账号"
          placeholder="用户名"
          :rules="[{ required: true, message: '请填写用户名' }]"
      />
      <van-field
          v-model="password"
          type="password"
          name="密码"
          label="密码"
          placeholder="密码"
          :rules="[{ required: true, message: '请填写密码' }]"
      />
      <div style="margin:16px;">
        <van-button round block type="info"  native-type="submit">登录</van-button>
      </div>
    </van-form>
    <div style="margin: 16px;">
      <van-button round block plain  type="info" @click="goto('register')">注册</van-button>
    </div>
  </div>

</template>

<script>
import {doLoginStudent} from "@/api/student";

export default {
  name: "userLogin",
  data() {
    return {
      username:"",
      password:"",
    }
  },
  methods:{
    login(){
      doLoginStudent(this.username,this.password).then(res=>{
        if (res.code===200){
          window.localStorage.setItem("sid",res.data.studentId);
          this.$router.push("index");
        }
      })
    },
    goto(path){
      this.$router.push(path)
    }
  }
}
</script>

<style  lang="less" scoped>
.avatar_box{
  img {
    height: 130px;
    width: 130px;
    border-radius: 50%;
    background-color: #eee;
  }
}
</style>
